import React, { memo, useEffect, useState } from 'react';
import { message, Modal, Spin } from 'antd';
import { querySalarySheet } from '@/services/salaryManage/salaryCalculate';
import SalarySheet from '@/pages/SalaryManage/components/SalarySheet';

const SalarySheetModal = ({
    visible = true,
    currentSelectYear,
    currentSelectMonth,
    currentOrgCode,
    onCancel = () => {}
}) => {
    const [salaryData, setSalaryData] = useState({});
    const [loading, setLoading] = useState(false);
    const getSalaryData = async () => {
        try {
            setLoading(true);
            const { code, data = {}, msg } = await querySalarySheet(
                currentOrgCode,
                currentSelectYear,
                currentSelectMonth
            );
            if (code === 10000) {
                setSalaryData(data);
            } else {
                message.error(msg);
            }
            setLoading(false);
        } catch (e) {
            console.log(e);
        }
    };
    useEffect(() => {
        if (visible) {
            getSalaryData();
        }
    }, [visible]);
    return (
        <Modal title="薪资条预览" width={840} visible={visible} footer={null} onCancel={onCancel}>
            <Spin spinning={loading}>
                <div style={{ padding: '12px 14px 40px' }}>
                    <SalarySheet salaryData={salaryData} hideSensitive={false} organizationCode={currentOrgCode} />
                </div>
            </Spin>
        </Modal>
    );
};
export default memo(SalarySheetModal);
